<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>输入框</title>
    <link rel="stylesheet" type="text/css" href="css/head.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/head.js"></script>
    <script>
        function degnlu(){
            var flg= $('.middle').children('li').data("lim")
            if (flg!=""){
                if (confirm("您已登录，是否退出当前账号重新登录！")){
                    location.href="${pageContext.request.contextPath}/LoginUserServlet?tuichu=true"
                }else {
                }
            }else {
                location.href="${pageContext.request.contextPath}/login.jsp"
            }
        }
        $(function (){
            $('.anniu').on('click',function (){
                var shu= $('.sousuo').val();
                location.href="${pageContext.request.contextPath}/searchServlet?spName="+shu;
            })

            document.onkeydown=function (e){
                var shu= $('.sousuo').val();
                var ev= document.all ? window.event : e;
                if (ev.keyCode==13){
                    location.href="${pageContext.request.contextPath}/searchServlet?spName="+shu;
                }
            }
            //商品分类查询
            ification();
        })
        function tui(){
            var flg= $('.middle').children('li').data("lim")
            if (flg!=""){
                if (confirm("您确定退出当前账号嘛？")){
                    location.href="${pageContext.request.contextPath}/LoginUserServlet?tuichu=true";
                }
            }else {
                alert("您还未登录，无法执行此操作")
            }
        }
        function ger(){
            location.href="${pageContext.request.contextPath}/Personal.jsp"
        }
        function shouye(){
            location.href="${pageContext.request.contextPath}/index.jsp"
        }
        function ification(){
            $.get("${pageContext.request.contextPath}/classIfcationServlet",function (result) {
                var ke='<li>全部商品</li><li onclick="shouye()" style="cursor: pointer">首页</li>'

                for (let i = 0; i < result.length; i++) {
                    ke+='<li onclick="fenye('+result[i].classid+')">'+result[i].classname+'</li>';
                }
                $('#xialaId').html(ke);
            })
        }
        function fenye(cid){
            console.log(cid)
            window.open("${pageContext.request.contextPath}/divide.jsp?classid="+cid)
        }
    </script>
</head>
<body>
<div class="da">
    <ul class="middle">
        <c:if test="${sessionScope.usersList.user_pur!=null}">
            <li data-lim="${sessionScope.usersList.user_pur}">${sessionScope.usersList.account} 欢迎您</li>
        </c:if>
        <c:if test="${sessionScope.usersList.user_pur==null}">
            <li data-lim="${sessionScope.usersList.user_pur}">回头鱼商城 欢迎您!</li>
        </c:if>
        <li onclick="degnlu()">登录</li>
        <li onclick="tui()" style="cursor: pointer">退出</li>
    </ul>
    <ol class="order">
        <li style="cursor: pointer" onclick="ger()">个人中心</li>
        <li>
            <img src="img/people.gif" alt="">
            在线客服</li>
        <li>客服热线:<span>400-6699-840</span></li>
    </ol>
</div>

<div class="cai">
    <input type="text" class="sousuo" placeholder="请输入关键字">
    <button class="anniu">搜索</button>
    <ul class="disp">
        <li>热搜榜：</li>
        <li>葡萄籽</li>
        <li>蜂胶</li>
        <li>胶原蛋白</li>
        <li>袋鼠精</li>
        <li>鱼油</li>
        <li>辅酶Q10</li>
    </ul>
    <!-- 下拉菜单 -->
    <div class="xiala">
        <ol id="xialaId">

        </ol>
    </div>
<%--    <!-- 下拉菜单卷帘门 -->--%>
<%--    <div class="juanlian-zhenhao">--%>
<%--        <ul id="juanlianId">--%>

<%--        </ul>--%>
<%--    </div>--%>

    <div class="cela">
        <ul>
            <li>
                <div class="nan">
                    <div class="Head-Nutrition">
                        <span class="zhuhe">男士组合</span>
                        <ol class="biao">
                            <li>男性功能</li>
                            <li>前列腺疾病</li>
                            <li>肝脏保养</li>
                            <li>易疲劳</li>
                            <li>睡眠</li>
                            <li>记忆力</li>
                            <li>免疫力</li>
                            <li>护眼</li>
                            <li>肠胃调理</li>
                            <li>便秘</li>
                            <li>肥胖人群</li>
                            <li>运动健身</li>
                            <li>男性综合</li>
                        </ol>
                    </div>

                    <div class="Head-Nutrition">
                        <span class="zhuhe">男士组合</span>
                        <ol class="biao">
                            <li>男性功能</li>
                            <li>前列腺疾病</li>
                            <li>肝脏保养</li>
                            <li>易疲劳</li>
                            <li>睡眠</li>
                            <li>记忆力</li>
                            <li>免疫力</li>
                            <li>护眼</li>
                            <li>肠胃调理</li>
                            <li>便秘</li>
                            <li>肥胖人群</li>
                            <li>运动健身</li>
                            <li>男性综合</li>
                        </ol>
                    </div>

                    <div class="Head-Nutrition">
                        <span class="zhuhe">男士组合</span>
                        <ol class="biao">
                            <li>男性功能</li>
                            <li>前列腺疾病</li>
                            <li>肝脏保养</li>
                            <li>易疲劳</li>
                            <li>睡眠</li>
                            <li>记忆力</li>
                            <li>免疫力</li>
                            <li>护眼</li>
                            <li>肠胃调理</li>
                            <li>便秘</li>
                            <li>肥胖人群</li>
                            <li>运动健身</li>
                            <li>男性综合</li>
                        </ol>
                    </div>

                    <div class="Head-Nutrition">
                        <span class="zhuhe">男士组合</span>
                        <ol class="biao">
                            <li>男性功能</li>
                            <li>前列腺疾病</li>
                            <li>肝脏保养</li>
                            <li>易疲劳</li>
                            <li>睡眠</li>
                            <li>记忆力</li>
                            <li>免疫力</li>
                            <li>护眼</li>
                            <li>肠胃调理</li>
                            <li>便秘</li>
                            <li>肥胖人群</li>
                            <li>运动健身</li>
                            <li>男性综合</li>
                        </ol>
                    </div>
                </div>
            </li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
            <li>7</li>
        </ul>
    </div>
</div>



</body>
</html>
